<template>
	<view class="page">
		<view class="tit">
			<view class="">支付金额：</view>
			<view class="money">¥{{money}}</view>
		</view>
		<view class="button-sp-area">
			<button type="primary" class="btn" @click="payMoney">立即付款</button>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				money:0,
				order_id:0
			}
		},
		onLoad(e) {
			let self = this;
			self.order_id = e.id;
			this.$request.request({
				url:'/order/offline/info',
				data:{
					order_id:self.order_id
				},
				success:function(res){
					if(res.code==200){
						self.money = res.result.real_payments / 100;
						self.$request.wx_config()
					}else if(res.code==40003){
						uni.navigateTo({
							url:'../../pages/login/login?page=pay&id='+self.order_id
						})
					}
				}
			})
		},
		methods: {
			payMoney(){
				let self = this;
				self.$request.request({
					url:'/user/info',
					success:function(res){
						if(res.code==200){
							let user_id = res.result.id;
							self.$request.request({
								url:'/order/offline/pay',
								data:{
									order_id:self.order_id
								},
								success:function(res){
									if(res.code==200){
										// #ifdef MP-WEIXIN
										uni.requestPayment({
											timeStamp:res.result.timeStamp,
											nonceStr:res.result.nonceStr,
											package:res.result.package,
											signType:res.result.signType,
											paySign:res.result.paySign,
											success:function () {
												uni.showToast({
												    title: '支付成功！',
												    duration: 2000
												});
												setTimeout(function() {
													uni.redirectTo({
													    url: '../record/record'
													});
												}, 2000);
											},
											fail:function () {
												uni.showToast({
												    title: '支付失败，请稍后重试',
													icon: 'none',
												    duration: 2000
												});
												setTimeout(function() {
													uni.redirectTo({
													    url: '../record/record'
													});
												}, 2000);
											}
												
										})
										// #endif
										
										// #ifdef H5
										self.wx.chooseWXPay({
										  timestamp: res.result.timeStamp, // 支付签名时间戳，注意微信jssdk中的所有使用timestamp字段均为小写。但最新版的支付后台生成签名使用的timeStamp字段名需大写其中的S字符
										  nonceStr: res.result.nonceStr, // 支付签名随机串，不长于 32 位
										  package: res.result.package, // 统一支付接口返回的prepay_id参数值，提交格式如：prepay_id=\*\*\*）
										  signType: res.result.signType, // 签名方式，默认为'SHA1'，使用新版支付需传入'MD5'
										  paySign:res.result.paySign, // 支付签名
										  success: function (res) {
										    uni.showToast({
										        title: '支付成功！',
										        duration: 2000
										    });
										    setTimeout(function() {
										    	uni.redirectTo({
										    	    url: '../record/record'
										    	});
										    }, 2000);
										  },
										  fail:function () {
										  	uni.showToast({
										  	    title: '支付失败，请稍后重试',
										  		icon: 'none',
										  	    duration: 2000
										  	});
										  	setTimeout(function() {
										  		uni.redirectTo({
										  		    url: '../record/record'
										  		});
										  	}, 2000);
										  }
										});
										
										// #endif
									}else{
										uni.showToast({
										    title: res.msg,
											icon: 'none',
										    duration: 2000
										});
										setTimeout(function() {
											uni.switchTab({
												 url: '../../pages/index/index'
											});
										}, 2000);
									}
								}
							});
						}else{
							uni.navigateTo({
								url:'../../pages/login/login?page=pay&id='+self.order_id
							})
						}
					}
				});
			}
		}
	}
</script>

<style scoped>
.page{
	width: 100%;
	min-height: 100vh;
	box-sizing: border-box;
	padding: 0 40upx;
	padding-top: 100upx;
	background-color: #efefef;
	
}
.button-sp-area{
	width: 50%;
	margin: 0 auto;
}
.money{
	font-size: 20px;
	text-align: center;
	margin-bottom: 100upx;
}
.tit{
	position: relative;
	width: 100%;
	box-sizing: border-box;
	padding: 30upx;
	border-radius: 20upx;
	background-color: #FFFFFF;
	margin-bottom: 100upx;
}
.pay-msg{
	display: flex;
	flex-direction: column;
	/* justify-content: space-between; */
}
.money{
	width: 100%;
	border-bottom:1px solid #efefef ;
	text-align: center;
	font-size: 18px;
}
.btn{
	background-color: #859dc2;
}
</style>
